import { reactive, onMounted, onBeforeUnmount, getCurrentInstance, defineProps, withDefaults } from 'vue';
import page from './page.ts';
import { useRouter, useRoute } from 'vue-router';
import { getSupplier } from '@/utils/optionsArr.ts';
export function useListComponent(props: any = {}) {
  const router = useRouter();
  const route = useRoute();
  const { proxy } = getCurrentInstance() as any;
  const options = reactive({
    //启用状态
    state: [
      {
        label: '待确认',
        value: 0,
        type: 'info',
      },
      {
        label: '已确认',
        value: 1,
        type: 'success',
      },
      {
        label: '已作废',
        value: 2,
        type: 'warning',
      },
    ],
    //启用状态
    isShowDisabled: [
      {
        label: '启用',
        value: 0,
        type: 'success',
      },
      {
        label: '禁用',
        value: 1,
        type: 'info',
      },
    ],
    //供应商
    supplier: [],
    //物料类型
    category: [],
    //物料分组
    goodGroup: [],
    //单位
    unit: [],
  });
  //页面信息
  const dataInfo: any = reactive({
    loading: false, //加载
    loadingMsg: '列表数据加载中', //加载
    //分类
    tabs: {
      title: '物料分组', //分类
      search: '', //搜索
      activeKey: 'groupCode', //唯一值key
      titleKey: 'groupName', //唯一值key
      active: '', //选中值
      list: [], //数据
      //分类操作
      operation: [
        {
          title: '编辑',
          icon: 'Edit',
          click: (row: any, index: number) => {
            proxy.$messageInputBox(`修改分组【${row.groupName}】`, (value: string) => {
              proxy.$api.GoodsGroup.UpdateGoodsGroup({
                ...row,
                groupName: value,
              })
                .then((res: any) => {
                  proxy.$message('修改成功');
                  getTabs();
                })
                .catch(() => {});
            });
          },
        },
        {
          title: '删除',
          icon: 'Delete',
          click: (row: any, index: number) => {
            proxy.$messageBox('是否删除当前数据，请确认！', () => {
              proxy.$api.GoodsGroup.DeleteGoodsGroup({
                entityID: row.groupID, //	对象主键ID
                entityCode: row.groupCode, //对象唯一识别码
              })
                .then((res: any) => {
                  getTabs();
                  const _tabs = dataInfo.tabs;
                  if (row.groupCode === _tabs.active) {
                    clickTabs(_tabs.list[index - 1]);
                  }
                })
                .catch(() => {});
            });
          },
        },
      ],
      //分类点击列表
      click: (row: any, index: number) => {
        clickTabs(row);
      },
      add: {
        //分类新建按钮
        click: () => {
          proxy.$messageInputBox(`请填写新的分组名称`, (value: string) => {
            proxy.$api.GoodsGroup.AddGoodsGroup({
              groupName: value,
              groupSort: 2000,
            })
              .then((res: any) => {
                proxy.$message('新建成功');
                getTabs();
              })
              .catch(() => {});
          });
        },
      },
    },
    table: {
      title: page.title, //表格-标题
      //表格-内容数据
      tbody: [],
      rowKey: 'specificationCode',
      theadCode: !!props.thead ? '' : 'goodslist', //basedatatable
      //表格-表头数据
      thead: props.thead || [],
      //表格-搜索数据
      search: {
        pageIndex: 1, //当前页码
        pageSize: 30, //每页显示数据的数量
        totalCount: 0, //总数量
        queryDataBaseFiled: '', // 关键字查询字段，空值查询全部
        likeWords: '', // 查询关键字，空值查询全部
        beginTime: '', // 日期范围-开始时间
        endTime: '', // 日期范围-结束时间
        orderByFiled: '', // 排序字段
        orderByType: 0, // 排序方式，0-倒序,1-升序
        onlySelf: 0, // 是否只查询自己创建的，0：查所有、1：只查自己创建的
        //差异化
        isShowDisabled: 0, // 是否显示禁用,-1：显示所有的；0：仅显示未作废的；1 仅显示作废的
        groupCode: '', // 物料分组编码
        supplierCode: '', // 供应商编码
        state: -1, // 状态:-1:全部；0待确认；1已确认；2已作废
        specificationCodes: [], // 规格code数组
        ...props.search,
      },
      //多选
      checkbox: {
        state: true,
        selectable: (row: any) => {
          return props.selectable && typeof props.selectable === 'function' ? props.selectable(row) : true;
        },
        list: [],
      },
      //表格-按钮数据
      btns: [
        {
          title: '导出数据',
          icon: 'Download',
          type: '',
          children: [
            {
              title: '导出当页数据',
              click: () => {
                setLoading('导出当页数据,请稍等');
                exportBtn(dataInfo.table.tbody);
              },
            },
            {
              title: '导出全部数据',
              click: () => {
                setLoading('正在导出全部数据,请稍等');
                proxy.$api.Business.GetMatchPageEmployees({
                  ...dataInfo.table.search,
                  pageIndex: 1,
                  pageSize: 10000,
                })
                  .then((res: any) => {
                    exportBtn(res.list);
                  })
                  .catch(() => {
                    dataInfo.loading = false;
                  });
              },
            },
            {
              title: '导出选中数据',
              click: () => {
                setLoading('导出选中数据,请稍等');
                exportBtn(dataInfo.table.checkbox.list);
              },
            },
          ],
        },
        {
          title: '新建',
          icon: 'Plus',
          type: 'primary',
          click: () => {
            getPath({
              path: `${route.path}/details`,
              query: {
                type: 1,
              },
            });
          },
        },
      ],
      //列表双击
      // dblclick: (row: any) => {
      // },
      //表格-列表搜索
      operation: [
        {
          title: '编辑',
          click: (row: any) => {
            getPath({
              path: `${route.path}/details`,
              query: {
                type: 2,
                specificationCode: row.specificationCode,
              },
            });
          },
        },
        {
          title: '添加规格',
          click: (row: any) => {
            getPath({
              path: `${route.path}/details`,
              query: {
                type: 1,
                specificationCode: row.specificationCode,
              },
            });
          },
        },
        {
          title: (row: any) => {
            return row.state === 0 ? '确认' : '撤回';
          },
          click: (row: any) => {
            proxy.$api.Goods.UpdateGoodsSpecificationState({
              specificationCode: row.specificationCode,
              type: 1, //	要修改的字段（0：启用状态，1：物料状态）
              state: row.state === 0 ? 1 : 0, //Type为0时，传0为启用，1为禁用，Type为1时，传1为待确认，2为作废
              reason: '', //作废原因
            })
              .then((res: any) => {
                ElMessage({
                  message: `${row.state === 0 ? '确认' : '撤回'}成功`,
                  type: 'success',
                });
                getTbody();
              })
              .catch(() => {});
          },
        },
        {
          title: (row: any) => {
            return row.isDisable === 0 ? '禁用' : '启用';
          },
          disabled: (row: any) => {
            return row.state === 2;
          },
          click: (row: any, index: number) => {
            proxy.$api.Goods.UpdateGoodsSpecificationState({
              specificationCode: row.specificationCode,
              type: 0, //	要修改的字段（0：启用状态，1：物料状态）
              state: row.isDisable === 0 ? 1 : 0, //Type为0时，传0为启用，1为禁用，Type为1时，传1为待确认，2为作废
              reason: '', //作废原因
            })
              .then((res: any) => {
                ElMessage({
                  message: `${row.isDisable === 0 ? '禁用' : '启用'}成功`,
                  type: 'success',
                });
                getTbody();
              })
              .catch(() => {});
          },
        },
        {
          title: '作废',
          disabled: (row: any) => {
            return row.state !== 0;
          },
          click: (row: any, index: number) => {
            proxy.$messageInputBox(`请输入作废原因`, (value: string) => {
              proxy.$api.Goods.UpdateGoodsSpecificationState({
                specificationCode: row.specificationCode,
                type: 1, //	要修改的字段（0：启用状态，1：物料状态）
                state: 2, //Type为0时，传0为启用，1为禁用，Type为1时，传1为待确认，2为作废
                reason: value, //作废原因
              })
                .then((res: any) => {
                  ElMessage({
                    message: `作废成功`,
                    type: 'success',
                  });
                  getTbody();
                })
                .catch(() => {});
            });
          },
        },
        // {
        //   title: '删除',
        //   disabled: (row: any) => {
        //     return row.state === 2;
        //   },
        //   click: (row: any, index: number) => {
        //     proxy.$messageBox('是否删除当前数据，请确认！', () => {
        //       proxy.$api.GoodsSpecification.DeleteSpecification({
        //         entityCode: row.specificationCode,
        //       })
        //         .then((res: any) => {
        //           proxy.$message(`删除成功`);
        //           getTbody();
        //         })
        //         .catch(() => {});
        //     });
        //   },
        // },
      ],
    },
  });
  // 获取tabs数据
  const getPath = (obj: any, row?: any) => {
    const path = router.resolve(obj);
    // 在新窗口或标签页中打开目标路径
    const newWindow: any = window.open(path.href, '_blank');
    newWindow;
  };
  // 获取tabs数据
  const getTabs = () => {
    proxy.$api.GoodsGroup.GetAllGoodsGroupData().then((res: any) => {
      res.unshift({
        isAll: true,
        isNotEdit: true,
        groupName: '全部',
        groupCode: '',
      });
      if (props.goodRow?.goodsCode) {
        res.unshift({
          isNotEdit: true,
          groupName: '规格型号',
          groupCode: 'specification',
        });
      }
      dataInfo.tabs.list = res;
      if (!dataInfo.tabs.active) {
        clickTabs(res[0]);
      }
    });
  };
  // 获取tabs数据
  const clickTabs = (row: any) => {
    if (row) {
      dataInfo.tabs.active = row.groupCode;
      dataInfo.table.title = `${page.title}【${row.groupName}】`;
      dataInfo.table.checkbox.list = [];
      getTbody();
    }
  };
  // 获取表数据
  const getTbody = () => {
    let _table: any = dataInfo.table;
    setLoading();
    let _search = {
      ..._table.search,
      groupCode: dataInfo.tabs.active, //分组编码
    };
    if (props.goodRow?.goodsCode && _search.groupCode === 'specification') {
      _table.isNotSearch = true;
      _search.groupCode = '';
      _search.queryDataBaseFiled = 'goodsCode';
      _search.likeWords = props.goodRow?.goodsCode;
    } else {
      _table.isNotSearch = false;
    }
    proxy.$api.Goods.GetPageGoodsSpecificationView(_search)
      .then((res: any) => {
        if (props.goodRow && dataInfo.tabs.active === 'specification') {
          _table.tbody = res.list.sort((rowA: any, rowB: any) => {
            return rowA.specificationJsValue - rowB.specificationJsValue;
          });
        } else {
          _table.tbody = res.list;
        }
        _table.search.totalCount = res.totalCount;
        dataInfo.loading = false;
      })
      .catch(() => {
        dataInfo.loading = false;
      });
  };
  // 导出数据
  const exportBtn = (tbody: any[]) => {
    proxy.$exportData(
      {
        thead: dataInfo.table.thead,
        tbody: tbody,
        fileName: dataInfo.table.title,
      },
      dataInfo,
    );
    setTimeout(() => {
      dataInfo.loading = false;
    }, 1000);
  };
  const setLoading = (title: string = '正在获取数据,请稍等...') => {
    if (!dataInfo.loading) {
      dataInfo.loading = true;
      dataInfo.loadingMsg = title;
    }
  };
  // 组件挂载后执行
  onMounted(() => {
    getSupplier(options, 'supplier');
  });
  // 组件卸载前执行
  onBeforeUnmount(() => {});
  return { dataInfo, getTbody, getTabs, options };
}
